<template>
	<div class="user-page">
		<!--查询表单-->
		<el-card class="box-card mb10" shadow="never">
			<el-form ref="searchFormRef" class="search-form" :inline="true" label-position="left" label-width="80px" :model="searchForm">
				<el-row :gutter="30" justify="start">
					<el-col :span="6">
						<el-form-item class="form-item" label="任务名称:" prop="jobDesc">
							<el-input v-model="searchForm.jobDesc" placeholder="请输入任务名称" />
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item class="form-item" label="调度状态:" prop="triggerCode">
							<el-select v-model="searchForm.triggerCode" class="el-form-item" clearable placeholder="请选择调度状态">
								<el-option label="成功" value="200" />
								<el-option label="失败" value="500" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item class="form-item" label="执行状态:" prop="handleCode">
							<el-select v-model="searchForm.handleCode" class="el-form-item" clearable placeholder="请选择执行状态">
								<el-option label="空" value="0" />
								<el-option label="成功" value="200" />
								<el-option label="失败" value="500" />
							</el-select>
						</el-form-item>
					</el-col>
					<template v-if="!searchMore">
						<el-col :span="6">
							<el-form-item class="form-item" label="任务分组:" prop="jobGroup">
								<el-select-v2 v-model="searchForm.jobGroup" class="el-form-item" clearable filterable :options="options" placeholder="请选择任务分组" @visible-change="handleModelIdReq" />
							</el-form-item>
						</el-col>
						<el-col :span="6">
							<el-form-item class="form-item" label="调度时间:" prop="createTimeAry">
								<el-date-picker v-model="createTimeAry" class="el-form-item" end-placeholder="结束日期" range-separator="至" start-placeholder="开始日期" type="daterange" />
							</el-form-item>
						</el-col>
						<el-col :span="6">
							<el-form-item class="form-item" label="执行时间:" prop="createTimeAry1">
								<el-date-picker v-model="createTimeAry1" class="el-form-item" end-placeholder="结束日期" range-separator="至" start-placeholder="开始日期" type="daterange" />
							</el-form-item>
						</el-col>
					</template>
					<el-col :span="6">
						<div class="search-btn">
							<el-button type="primary" @click="handleSearch">查询</el-button>
							<el-button @click="handleReset">重置</el-button>
							<a class="more-search" @click="searchMore = searchMore ? false : true">
								{{ searchMore ? '展开' : '收起' }}
								<el-icon>
									<component :is="searchMore ? 'ele-ArrowDown' : 'ele-ArrowUp'" color="#0052CC" />
								</el-icon>
							</a>
						</div>
					</el-col>
				</el-row>
			</el-form>
		</el-card>
		<!--查询表格-->
		<el-card class="box-card" shadow="never">
			<static-table :tableData="tableData" :loading="loading" @on-selection-change="handleSelectionChange">
				<template #vux-search>
					<el-row :gutter="12">
						<el-button class="ml8 mb10" type="warning" :disabled="sectionsAry.length == 0" @click="handleDelete">批量删除</el-button>
					</el-row>
				</template>
				<template #vux-column>
					<vxe-column field="selection" fixed="left" type="checkbox" width="60" />
					<vxe-column field="jobId" min-width="100" show-overflow="tooltip" title="任务ID" />
					<vxe-column field="triggerTime" min-width="150" title="调度时间" />
					<vxe-column field="triggerCode" min-width="150" title="调度结果" />
					<vxe-column field="triggerMsg" min-width="120" title="调度备注">
						<template #default="{ row }">
							<div class="vxe-action">
								<a v-if="row.triggerMsg" style="cursor: pointer" @click="handleDetail(row.triggerMsg)">详情</a>
								<span v-else>--</span>
							</div>
						</template>
					</vxe-column>
					<vxe-column field="handleTime" min-width="150" title="执行时间" />
					<vxe-column field="handleCode" min-width="150" title="执行结果" />
					<vxe-column field="operation" fixed="right" min-width="120" title="操作">
						<template #default="{ row }">
							<div class="vxe-action">
								<a v-if="row.handleMsg" style="cursor: pointer" @click="handleDetail(row.handleMsg)">详情</a>
								<span v-else>--</span>
							</div>
						</template>
					</vxe-column>
				</template>
			</static-table>
			<el-pagination background :current-page="pageNum" :layout="layout" :page-size="pageSize" :total="dataCount" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
		</el-card>
		<ViewLogModal ref="viewLogModalRef" />
	</div>
</template>
<script name="taskLogManage" setup>
import global from '@/utils/global'
import useTableList from '@/hooks/useTableList'
import { useRoute } from 'vue-router'

const ViewLogModal = defineAsyncComponent(() => import('./leafPages/ViewLogModal.vue'))
/*
 *@Description: 状态初始化
 *@MethodAuthor: liuYuFeng
 *@Date: 2023-09-11 18:43:11
 */

const route = useRoute()
const state = reactive({
	searchForm: {
		jobDesc: '',
		triggerCode: '',
		handleCode: '',
		jobId: '',
		jobGroup: null,
	},
	createTimeAry: [],
	createTimeAry1: [],
	editTimeTaskModalRef: null,
	searchFormRef: null,
	viewLogModalRef: null,
	sectionsAry: [],
	options: [],
})
const { searchForm, createTimeAry, searchFormRef, createTimeAry1, sectionsAry, options, viewLogModalRef } = toRefs(state)

const queryUrl = '/meta-system/web/v1/jobLog/list'
const { loading, dataCount, searchMore, handleInitQuery, getTimeParseAry, tableData, pageNum, pageSize, layout, handleSizeChange, handleCurrentChange } = useTableList(queryUrl, state.searchForm, true, false)

onMounted(() => {
	state.searchForm.jobId = route.query.id
	handleSearch()
})
/*
 *@Description: 方法模块
 *@MethodAuthor: liuYuFeng
 *@Date: 2023-09-11 18:41:29
 */
const handleSearch = () => {
	const { triggerBeginTime, triggerEndTime } = getTimeParseAry(state.createTimeAry, 'triggerBeginTime', 'triggerEndTime')
	state.searchForm.triggerBeginTime = triggerBeginTime
	state.searchForm.triggerEndTime = triggerEndTime

	const { handleBeginTime, handleEndTime } = getTimeParseAry(state.createTimeAry, 'handleBeginTime', 'handleEndTime')
	state.searchForm.handleBeginTime = handleBeginTime
	state.searchForm.handleEndTime = handleEndTime

	handleInitQuery()
}
const handleReset = () => {
	state.searchFormRef.resetFields()
	state.createTimeAry = []
	handleSearch()
}
const handleModelIdReq = e => {
	if (e && state.options.length == 0) {
		global.$fetchGetData('/meta-system/web/v1/job/getJobsByGroup', {}).then(data => {
			if (data.code == 200) {
				state.options = data.data
			} else {
				global.$baseMessage(data.msg, 'error')
			}
		})
	}
}
const handleDetail = data => {
	state.viewLogModalRef.handleShowModal(data)
}
const handleDelete = () => {
	const ids = []
	if (state.sectionsAry.length == 0) {
		global.$baseMessage('请至少选择一条记录！', 'warning')
		return false
	}
	state.sectionsAry.forEach(item => {
		ids.push(item.id)
	})
	global.$baseConfirm(
		'是否确认删除所选日志数据?',
		'提示',
		() => {
			global.$fetchPostData('/meta-system/web/v1/jobLog/clearLog', { logIds: ids }).then(data => {
				if (data.code == 200) {
					global.$baseMessage(data.msg, 'success')
					handleSearch()
				} else {
					global.$baseMessage(data.msg, 'error')
				}
			})
		},
		() => {}
	)
}
const handleSelectionChange = records => {
	state.sectionsAry = records
}
</script>
<style lang="scss" scoped></style>
